<title>添加预约</title>
@extends('admin.common.main')
<!-- webupload上传样式 -->
<link rel="stylesheet" type="text/css" href="/webuploader/webuploader.css">
@section('html')
    <nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页
        <span class="c-gray en">&gt;</span> 预约管理
        <span class="c-gray en">&gt;</span> 添加预约
        <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px"
           href="javascript:location.replace(location.href);" title="刷新"><i class="Hui-iconfont">&#xe68f;</i></a>
    </nav>
    <article class="page-container">
        {{-- 表单验证提示 --}}
        @include('admin.common.validate')
        <form action="{{ route('admin.notice.store') }}" method="post" id="fang-add"  class="form form-horizontal">
            @csrf
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>房东：</label>
                <div class="formControls col-xs-8 col-sm-9">
                   <select name="fangowner_id">
                        <option value=''>-- 选择房东 --</option>
                        @foreach($owner as $item)
                            <option value="{{ $item->id }}">{{ $item->name }}</option>
                        @endforeach
                   </select>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>租客：</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="number" class="input-text" name="renting_id" />
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>预约时间：</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})" autocomplete="off" class="input-text Wdate" name="dtime" style="width:200px" />
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>内容：</label>
                <div class="formControls col-xs-8 col-sm-9">
                    <input type="text" class="input-text" name="cnt" />
                </div>
            </div>
            <div class="row cl">
                <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
                    <input class="btn btn-primary radius" type="submit" value="添加预约" /> 
                </div>
            </div>
        </form>
    </article>
@endsection
@section('js')
    <script type="text/javascript">

        // 前端表单验证
        // https://www.runoob.com/jquery/jquery-plugin-validate.html
        $("#fang-add").validate({
            // 规则
            rules: {
                fangowner_id: {
                    required: true
                },
                renting_id: {
                    required: true
                },
                dtime: {
                    required: true
                },
                cnt: {
                    required: true
                },
            },
            messages:{
                fangowner_id:{
                    required:'请选择 房东'
                },
                renting_id: {
                    required: '请输入 租客ID'
                },
                dtime: {
                    required: '请选择 预约时间'
                },
                cnt: {
                    required: '请填写 内容'
                },
            },
            // 取消键盘事件
            onkeyup: false,
            // 验证成功后的样式
            success: "valid",
            // 验证通过后，处理的方法 form dom对象
            submitHandler: function (form) {
                // 表单提交
                form.submit();
            }
        });
    </script>
@endsection


